<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>css样式</title>
		<!-- html中元素自带属性和属性值  做单个元素的效果
		     css样式表  整体或者单个元素的效果
			 使用css   1.引入css3样式
			            1.1内联样式表  不建议使用  没有实现内容与 表现分离
						1.2内部样式表  练习专用
						     1.2.1  使用方式   在head元素添加style元素
							 1.2.2  编写css语法  选择器  元素选择器  抓取页面的元素
						1.3外部样式表   项目专用
						     1.3.1  使用方式  head元素  添加link元素  指定css文件
							 1.3.2 创建  xxx。css文件
						1.4引入样式表  不用  有致命bug
						     1.4.1  使用  head元素  添加style元素
							 1.4.2  创建  xxx.css文件
							 1.4.3  在style元素中加@inport(xxx.css)
							 缺点   项目内容大  先执行结构执行出来  等一会  效果加不上
							                    先执行效果css，然后在执行结构html
			           2.编写css3语法  css属性和属性值的使用
					   3.
-->
<style>
	@import url(css/引入样式表.css);
	/*css3的注释*/
	p{
	/* css3属性和属性值  添加【样式】效果 */
	/*效果  居中*/
	text-align: center;
	/* 效果  背景颜色  色值  十六进制 */
	background-color: #41a863;/* 京东红 主题色 */
	/* 效果：文本放大 */
	font-size: 60px;
	/* 效果：宽高 */
	width: 249px;
	height: 249px;
	/* 效果：行高与高度一致    垂直居中*/
	line-height: 249px;
	}

</style>
	<link rel="stylesheet" href="css/index.css">
	</head>
	<body>
		<!-- html效果 -->
		<p>lorem1</p>
		<!-- css的效果 -->
		<p>lorem2</p>
		<span>行元素内容</span>
		
	</body>
</html>
